<template lang="pug">
  keep-alive
    kalix-tree-grid(bizKey="videos" title="章节"
    v-bind:columns='columns'
    v-bind:targetURL="targetURL"
    v-bind:customTableTool="customTableTool"
    v-bind:btnList="btnList"
    v-bind:bizDialog="bizDialog"
    v-bind:formModel="formModel"
    v-bind:dialogOptions="dialogOptions"
    v-on:selectedRow="selectedRow"
    v-bind:isSearchAfterHandle="true"
    v-on:handleAfterSearch="handleAfterSearch"
    v-bind:isLimitLayer="false"
    v-bind:toolbarBtnList="toolBarBtnList"
    v-bind:buttonPermissionPrefix="buttonPermissionPrefix"
    )
</template>


<script type="text/ecmascript-6">
  import FormModel from './model'
  import {TrainingVideosUrl, videosBtnPermissionPrefix} from '../../config.toml'
  import {trainingVideosConfigBtnList} from './config'
  import {ON_REFRESH_DATA} from '@/components/corelib/components/common/event.toml'

  export default {
    name: 'kalix-training-videoss',
    data() {
      return {
        btnList: trainingVideosConfigBtnList,
        toolBarBtnList: [
          {id: 'add', isShow: true, title: '添加', isPermission: true}
        ],
        targetURL: TrainingVideosUrl + '/getVideosByVid',
        formModel: Object.assign({}, FormModel),
        columns: [{
          type: 'hidden',
          key: 'id',
          width: '0'
        }, {
          type: 'hidden',
          key: 'vid',
          width: '0'
        }, {
          title: '视频名称',
          key: 'title',
          width: '150'
        }, {
          title: '课程',
          key: 'cname',
          width: '150'
        }, {
          title: '学习人数',
          key: 'hits',
          width: '150'
        }, {
          title: '排序',
          key: 'sequence',
          width: '150'
        }, {
          title: '审核',
          key: 'audit',
          width: '150'
        }, {
          title: '操作',
          type: 'action',
          actions: [{
            type: 'edit',
            text: '编辑',
            icon: 'el-icon-edit'
          }, {
            type: 'delVideos',
            text: '删除',
            icon: 'el-icon-delete'
          }, {
            type: 'view',
            text: '查看',
            icon: 'el-icon-view'
          }],
          width: '150'
        }],
        bizDialog: [
          {id: 'edit', dialog: 'VideosEdit'},
          {id: 'add', dialog: 'VideosAdd'},
          {id: 'view', dialog: 'VideosView'}
        ],
        dialogOptions: {},
        buttonPermissionPrefix: videosBtnPermissionPrefix,
        customTableTool(row, btnId, that) {
          if (btnId === 'audit') {
            let warnInfo = '确定要' + (row.audit === '禁止' ? '通过' : '禁止') + '该视频吗？'
            that.$confirm(warnInfo, '警告', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              return this.$http.request({

                method: 'PUT',
                url: TrainingVideosUrl + '/' + row.id,
                params: {},
                data: {
                  id: row.id,
                  audit: row.audit === '禁止' ? '通过' : '禁止',
                  cid: row.cid,
                  hits: row.hits,
                  title: row.title,
                  vid: row.vid,
                  videoUrl: row.videoUrl
                }
              }).then((res) => {
                console.log(res)
                console.log('123')
                this.$KalixMessage.processResult(res)
                this.$KalixEventBus.$emit(ON_REFRESH_DATA)
              })
            })
          }
        }
      }
    },
    methods: {
      selectedRow(row) {
        if (row) {
          this.dialogOptions = {
            vid: row.id,
            // 选中以后orgName 为当前选中行的值
            videosName: row.title
          }
        } else {
          this.dialogOptions = {
            vid: -1,
            // 选中以后orgName 为当前选中行的值
            videosName: '根目录'
          }
        }
      },
      handleAfterSearch(tableData) {
        if (tableData && tableData.length) {
          this.dialogOptions = {
            vid: tableData[0].vid,
            // 未被选中时orgName 为父节点名
            videosName: tableData[0].videosName
          }
        }
      }
    }
  }
</script>

<style scoped lang="stylus">

</style>
